<template>
	<v-menu
			ref="menu"
			v-model="menu"
			:close-on-content-click="false"
			:return-value.sync="value_in"
			transition="scale-transition"
			offset-y
			full-width
	>
		<!--		transition="scale-transition"-->
		<!--		offset-y-->
		<!--		max-width="290px"-->
		<!--		min-width="290px"-->
		<template v-slot:activator="{ on }">
			<v-text-field
					v-model="value_in"
					:label="label"
					prependInnerIcon="event"
					:readonly="readonly"
					:hideDetails="hideDetails"
					:clearable="clearable"
					v-on="on"
			></v-text-field>
		</template>
		<v-date-picker
				v-model="value_in"
				no-title
				scrollable
				:locale="$i18n.locale"
				show-current
				:day-format="dayformat"
				:allowed-dates="allowedDates"
		>
			<v-spacer></v-spacer>
			<!--			<v-btn text color="primary" @click="">确定</v-btn>-->
		</v-date-picker>
	</v-menu>
</template>

<script>
  import mixin_input from './mixin_input'

  export default {
    name: "zzdate",
    mixins: [
      mixin_input,
    ],
    props: {
      allowedDates: [Function],
      clearable: {
        type: Boolean,
        default: true,
      }
    },
    data() {
      return {
        menu: false,
      }
    },
    watch: {
      value_in(newVal) {
        this.setValue(newVal)
        this.$refs.menu.save(newVal)
      }
    },
    created() {
    },
    methods: {
      dayformat(str) {
        return str.substring(8, 10)
      },
    }
  };
</script>
<style scoped lang="scss">

</style>
